<template>
<div class="list">
    <div style="position:sticky;top:0;z-index:1000;">
        <van-nav-bar  
        @click-left="$router.push('/home/me')"
        left-text="返回" 
        title="我的地址"></van-nav-bar>
    </div>
<div class="address">
<van-address-list
@click="choice(address)"
  v-model="chosenAddressId"
  :list="addresses"
  default-tag-text="默认"
  @add="onAdd"
  @edit="onEdit"
/>
</div>
</div>
</template>
<script>
import { get } from "../../../utils/request"
import {useRouter} from "vue-router"
import {ref,computed,onMounted} from "vue"
import {useStore} from "vuex"
export default ({

    setup() {
        let addresses = ref([])  
        let chosenAddressId = ref(0)
        let store = useStore();
        let router = useRouter();
        let user_info = computed(()=> store.state.user.user_info)
        let loadUserAddress =async function (){
            let url ="/app/address/queryByUserId"
            let userId=user_info.value.id
            // console.log(user_info.value.id+"--------------------")
            // console.log(userId+'=============')
            let resp = await get(url,{userId});
            // console.log(resp.data)
            let list = resp.data.map(item => {
                return {    
                    id:item.id,
                    address:item.province+" "+item.city+" "+item.area+" "+item.address,
                    tel:item.telephone,
                    name:item.realname,
                    areaCode:item.areaCode,
                    isDefault:item.isDefault
                }
            })
            addresses.value=list
        }
        function choice(row){
            console.log(row)
        };
        function onAdd(){
            router.push("/address_details",)
        }
        function onEdit(item){
            router.push({
                name:'address_details',
                params:item
            })
        }
        onMounted(async ()=>{
            await loadUserAddress();
        })

        return {
            addresses,chosenAddressId,choice,onAdd,onEdit
        }
    }
})
</script>

